<script setup lang="ts">
import { inject } from 'vue'

// 父组件注入时
// computed 和 provide 不能同时导出 非响应式 的值, 否则导致响应式异常
// provide 在导出 ref 时, 不能导出 .value 值(非响应式的值), 不然inject监听不到

// const data = ref({
//   name: '李四',
//   age: 18,
// })

// setTimeout(() => {
//   data.value = {
//     name: '张三',
//     age: 20,
//   }
// }, 2000)

// const dataCmp = computed(() => data.value)

// provide('stu', dataCmp.value)

const stu = inject<{
  name: string
  age: number
}>('stu')
</script>

<template>
  尝试注入
  <hr />
  {{ stu }}
</template>
